import React from 'react';

class User extends React.Component {
  greeting(){
    alert('greeting')
  }
  render() {
    return 'User';
  }
}




// class Demo extends React.Component {
//   render() {
//     return (
//       <input
//         ref={ele => {
//           this.myRef = ele;
//         }}
//       />
//     );
//   }

//   componentDidMount() {
//     console.log(this.myRef)
//     // this.myRef.value = '初始值'
//     this.myRef.focus();
//   }
// }

class Demo extends React.Component {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
    this.userRef = React.createRef();
    console.log(this.myRef)
  }

  render() {  
    return (
      <>
        <User ref={this.userRef}/>
        <input ref={this.myRef} />
      </>
    ) 
  }

  componentDidMount() {
    console.log(this.myRef)
    this.myRef.current.focus();
    this.myRef.current = 'hello word'
    console.log(this.myRef)
    this.userRef.current.greeting()
  }
}

export default Demo;
